<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <th:block th:include="include :: header('修改识别')"/>
</head>
<body class="white-bg">
<div class="wrapper wrapper-content animated fadeInRight ibox-content">
    <form class="form-horizontal m" id="form-predict-edit" th:object="${predict}">
        <input id="id" name="id" th:field="*{id}" type="hidden">
        <div class="form-group">
            <label class="col-sm-3 control-label">识别任务名称：</label>
            <div class="col-sm-8">
                <input id="predictName" name="predictName" th:field="*{predictName}" class="form-control" type="text">
            </div>
        </div>
        <div class="form-group" style="display: none">
            <label class="col-sm-3 control-label">所选训练任务的id：</label>
            <div class="col-sm-8">
                <input id="trainMissionId" name="trainMissionId" th:field="*{trainMissionId}" class="form-control"
                       type="text" readonly>
            </div>
        </div>

        <div class="form-group">
            <label class="col-sm-3 control-label">所选训练任务的名称：</label>
            <div class="col-sm-8">
                <select id="trainMissionName" name="trainMissionName" th:field="*{trainMissionName}"
                        class="form-control"></select>
            </div>
        </div>

        <div class="form-group" style="display: none">
            <label class="col-sm-3 control-label">所识别数据集的id：</label>
            <div class="col-sm-8">
                <input id="datasetId" name="datasetId" th:field="*{datasetId}" class="form-control" type="text"
                       readonly>
            </div>
        </div>

        <div class="form-group">
            <label class="col-sm-3 control-label">所识别数据集名称：</label>
            <div class="col-sm-8">
                <select id="datasetName" name="datasetName" th:field="*{datasetName}" class="form-control"></select>
            </div>
        </div>

        <div class="form-group">
            <!--                改为下拉框，只有未识别，待识别，识别中，已完成，识别异常五种状态-->
            <label class="col-sm-3 control-label">识别状态：</label>
            <div class="col-sm-8">
                <select id="status" name="status" th:field="*{status}" class="form-control">
                    <option value="未识别">未识别</option>
                    <option value="待识别">待识别</option>
                    <option value="识别中">识别中</option>
                    <option value="已完成">已完成</option>
                    <option value="识别异常">识别异常</option>

                </select>
            </div>
        </div>
    </form>
</div>
<div th:include="include::footer"></div>
<script type="text/javascript">
    var prefix = ctx + "deep_learning/predict";

    $("#form-predict-edit").validate({
        rules: {
            xxxx: {
                required: true,
            },
        },
        focusCleanup: true
    });

    function submitHandler() {
        if ($.validate.form()) {
            $.operate.save(prefix + "/edit", $('#form-predict-edit').serialize());
        }
        window.parent.postMessage('refreshTable', '*');
    }

    // 发起 AJAX 请求获取 TrainMission 列表
    $(document).ready(function () {
        // 发起 AJAX 请求获取 TrainMission 列表
        $.ajax({
            url: '/deep_learning/trainMission/getFinishedTrainMissionList',
            type: 'GET',
            dataType: 'json',
            success: function (response) {
                if (Array.isArray(response)) {
                    console.log('训练任务列表:', response);
                    // 解析并处理数据
                    populateSelectWithTrainMissions(response);
                } else {
                    console.error('返回数据格式不正确:', response);
                    alert('获取的训练任务数据格式不正确。');
                }
            },
            error: function () {
                alert('无法获取训练任务数据。');
            }
        });

        // 将 TrainMission 列表添加到 <select> 元素中
        function populateSelectWithTrainMissions(trainMissions) {
            var selectElement = $('#trainMissionName');
            var trainMissionIdElement = $('#trainMissionId');

            // 清空现有选项
            selectElement.empty();

            // 遍历每个 TrainMission 对象
            trainMissions.forEach(function (trainMission) {
                var optionValue = trainMission.id;
                var optionElement = $('<option></option>').attr('value', trainMission.trainMissionName).text(trainMission.trainMissionName);

                // 给每个选项添加自定义属性，以便在选择变化时获取 TrainMission 的 id
                optionElement.attr('data-id', optionValue);
                selectElement.append(optionElement);
            });

            // 默认选中传递来的数据集ID对应的选项
            var id = trainMissionIdElement.val();
            var selectedOption = selectElement.find('option[data-id="' + id + '"]');
            if (selectedOption.length > 0) {
                selectedOption.prop('selected', true);
                selectElement.val(selectedOption.val());
            }

            // 监听选择变化
            selectElement.on('change', function () {
                var selectedOption = $(this).find('option:selected');
                trainMissionIdElement.val(selectedOption.attr('data-id'));
            });
        }
    });

    // 发起 AJAX 请求获取 Dataset 列表
    $(document).ready(function () {
        $.ajax({
            url: '/deep_learning/trainMission/selectDatasetAndUser',
            type: 'GET',
            processData: false,
            contentType: false,
            success: function (response) {
                var datasets = response;
                var selectElement = $('#datasetName');
                var datasetIdElement = $('#datasetId');

                // 清空现有选项
                selectElement.empty();

                // 将每个数据集解析为一个选项
                datasets.forEach(function (dataset, index) {
                    var parts = dataset.split('|');
                    var id = parts[0];
                    var name = parts[1];
                    var user = parts[3];

                    var optionElement = $('<option></option>').attr('data-id', id).attr('data-user', user).text(name + ' ------- 归属用户：' + user);
                    selectElement.append(optionElement);

                    // 默认选中传递来的数据集ID对应的选项
                    if (id == [[${predict.datasetId}]]) {
                        selectElement.val(name + ' ------- 归属用户：' + user);
                        datasetIdElement.val(id);
                    }
                });

                // 监听选择变化
                selectElement.on('change', function () {
                    var selectedOption = $(this).find('option:selected');
                    datasetIdElement.val(selectedOption.attr('data-id'));
                });
            },
            error: function (xhr, status, error) {
                alert('无法获取数据集数据。');
            }
        });

        // 发起 AJAX 请求获取当前用户信息
        $.ajax({
            url: '/deep_learning/app01Dataset/currentUser',
            method: 'GET',
            success: function (response) {
                $('#userId').val(response.userId);
            },
            error: function (xhr, status, error) {
                console.error('请求当前用户信息失败:', error);
            }
        });
    });
</script>
</body>
</html>
